<template>
  <h1>{{ obj }}</h1>
  <button @click="btn">按钮</button>
</template>

<script lang="ts">
import { defineComponent, reactive } from 'vue'

export default defineComponent({
  setup() {
    // reactive 函数
    //   作用：用于创建响应式对象格式数据
    // 🚨注意点：
    //    reactive 函数的参数只能传入对象，不能传字符串，数值，布尔值等基本类型数据
    const obj = reactive({
      name: 'zs',
      age: 18,
    })

    // const aa = reactive({
    //   bb: 1
    // })

    const btn = () => {
      obj.age++
      // console.log(obj)
    }

    return { obj, btn }
  },
})
</script>
